<template>
<el-row :gutter="20">
  <el-col :span="12">
        <el-card class="box-card">
            <div slot="header" class="clearfix">
                <span>系统邮箱设置</span>
                <el-button style="float: right; padding: 3px 0" type="text" @click="saveEmil">保存</el-button>
            </div>
            <div class="text item">
                <el-form ref="emilForm"  label-width="150px" v-for="(i, index) in emilList" :key="index" :rules="rules">
                      <span v-if="i.paramName.indexOf('密码') != -1">
                        <el-form-item  :label="i.paramName"  :prop="i.paramCode" >
                            <el-input type="password" v-model="emilList[index].paramValue"></el-input>
                        </el-form-item>
                      </span>
                      <span v-else>
                          <el-form-item :label="i.paramName" :prop="i.paramValue" >
                              <el-input v-model="emilList[index].paramValue" ></el-input>
                          </el-form-item>
                      </span>
                </el-form>
            </div>
        </el-card>

  </el-col>
  <el-col :span="12">
        <el-card class="box-card">
        <div slot="header" class="clearfix">
            <span>短信设置</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="saveNote">保存</el-button>
        </div>
          <div class="text item">
              <el-form  label-width="150px" v-for="(i, index) in noteList" :key="index">
                  <el-form-item :label="i.paramName" >
                <span v-if="i.paramName.indexOf('密码') != -1">
                    <el-input type="password" v-model="noteList[index].paramValue"></el-input>
                  </span>
                  <span v-else>
                        <el-input v-model="noteList[index].paramValue"></el-input>
                  </span>
                  </el-form-item>
              </el-form>
            </div>
        </el-card>
  </el-col>
</el-row>
</template>
<script>
import { sysParam } from '@/api/platformApi'
export default {
  name: 'paramManage',
  data () {
var validateEmail = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请正确填写邮箱'))
        } else {
          if (value !== '') {
            var reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
            if (!reg.test(value)) {
              callback(new Error('请输入有效的邮箱'))
            }
          }
          callback()
        }
      }
    return {
      rules: {
        emil_1: [{ validator: validateEmail, required: true, message: '必填', trigger: 'blur' }],
        emil_2: [{ required: true, message: '必填', trigger: 'blur' }],
        emil_3: [{ required: true, message: '必填', trigger: 'blur' }],
        paramValue: [{ required: true, message: '必填', trigger: 'blur' }]
      },
      emilList: [],
      noteList: []
    }
  },
  created () {
    this.init()
  },
  methods: {
    saveEmil () {
      sysParam.create(this.emilList).then(res => {
        this.success('保存成功')
      })
    },
    saveNote () {
      sysParam.create(this.noteList).then(res => {
        this.success('保存成功')
      })
    },
    init () {
      sysParam.get('').then(res => {
        let datas = res
        let emils = []
        let notes = []
        for (let i = 0; i < datas.length; i++) {
          if (datas[i].paramCode.indexOf('emil') !== -1) {
            emils.push(datas[i])
          } else if (datas[i].paramCode.indexOf('note') !== -1) {
            notes.push(datas[i])
          }
        }
        this.emilList = emils
        this.noteList = notes
      })
    }
  }
}
</script>
<style>
  .el-row {
    margin-bottom: 20px;
  }
  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: #99a9bf;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
</style>
